<template>
  <div
    class="shadow-muted-300/50 dark:shadow-muted-900/50 relative flex h-[80px] w-[120px] shrink-0 flex-col justify-between overflow-hidden rounded-xl bg-current px-2.5 pb-2 pt-1.5 shadow-lg"
  >
    <div
      class="absolute -bottom-2.5 -end-2.5 z-10 h-12 w-12 rounded-full bg-white opacity-10"
    ></div>
    <div class="flex items-center justify-between">
      <span class="block font-sans text-xs font-medium text-white">**4628</span>
      <Icon name="cib:visa" class="h-7 w-7 text-white" />
    </div>
    <div class="flex items-center justify-between">
      <span class="block font-sans text-xs font-medium text-white">
        Credit Card
      </span>
    </div>
  </div>
</template>
